<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>1</title>
    <style>
        *{
            padding: 0;
            margin: 0;
        }
        .warper{
            width: 100%;
            margin: 50px auto;
        }
        .mian{
            background-color: aqua;
            float: left;
            height: 300px;
            width: 33.333333%;
        }
        @media (max-width: 600px) {
            .warper{
                width: 100%;
            }
            .mian{
                background-color: yellow;
                width: 100%;
            }
        }
    </style>
</head>
<body>
<div class="warper">
    <div class="mian">左边的东西</div>
    <div class="mian">中间的不是东西</div>
    <div class="mian">右边的玩意儿</div>
</div>
</body>
</html>